<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--import jstl标签--%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<%
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() +
            request.getContextPath() + "/";
%>
<html>
<head>
    <title>智能查询</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
    <script src="https://cdn.jsdelivr.net/npm/@tabler/core@1.0.0-beta17/dist/js/tabler.min.js"></script>
    <script type="text/javascript" src="res/jquery/jquery-1.11.1-min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tabler/core@1.0.0-beta17/dist/css/tabler.min.css">
    <style>
        @import url('https://rsms.me/inter/inter.css');

        :root {
            --tblr-font-sans-serif: 'Inter Var', -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI, Roboto, Helvetica Neue, sans-serif;
        }

        body {
            font-feature-settings: "cv03", "cv04", "cv11";
        }

        .datagrid-title{
            color: dodgerblue;font-size:15px;
        }
    </style>


    <script type="text/javascript">

        function initialData(){
            var params = {}
            $.ajax({
                url:'dev/user/getUserInfo',
                type:'get',
                dataType:'json',
                success:data => {
                    if(data.data == null){
                        $("#username_user").text(data.user.username)
                        $("#number_user").text(data.user.number)
                    }else{
                        alert(data.data)
                        window.location.href='toLogin'
                    }
                }
            })
            queryAjax(params)

        }

        function queryAjax(params){
            $.ajax({
                url:'dev/transport/queryTransportPage',
                //contentType: "application/json;charset=UTF-8",
                //contentType: "json",
                data: params,
                type:'post',
                dataType:'json',
                success: data => {
                    console.log(data)
                    info = data;
                    var htmlStr = "";
                    $.each(data.page.list, function(index,obj){

                        htmlStr +="<div class=\"col-6\">"
                        htmlStr +="    <div class=\"card\">"
                        htmlStr +="        <div class=\"card-header\">"
                        htmlStr +="            <h2 class=\"card-title\">承运方："+obj.company+"</h2>"
                        htmlStr +="        </div>"
                        htmlStr +="        <div class=\"card-body\">"
                        htmlStr +="            <div class=\"datagrid\">"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        htmlStr +="                    <div class=\"datagrid-title\">装载时间</div>"
                        htmlStr +="                    <div class=\"datagrid-content\">"+obj.pickupTime+"</div>"
                        htmlStr +="                </div>"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        htmlStr +="                    <div class=\"datagrid-title\">运输时效</div>"
                        htmlStr +="                    <div class=\"datagrid-content\">"+obj.limitTime+"小时</div>"
                        htmlStr +="                </div>"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        htmlStr +="                    <div class=\"datagrid-title\">运输方式</div>"
                        htmlStr +="                    <div class=\"datagrid-content\">"+obj.transportMode+"</div>"
                        htmlStr +="                </div>"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        htmlStr +="                    <div class=\"datagrid-title\">装载空间</div>"
                        htmlStr +="                    <div class=\"datagrid-content\">"+obj.volume+"立方米</div>"
                        htmlStr +="                </div>"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        htmlStr +="                    <div class=\"datagrid-title\">出发地</div>"
                        htmlStr +="                    <div class=\"datagrid-content\">"+obj.beginAddress+"</div>"
                        htmlStr +="                </div>"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        htmlStr +="                    <div class=\"datagrid-title\">目的地</div>"
                        htmlStr +="                    <div class=\"datagrid-content\">"+obj.endAddress+"</div>"
                        htmlStr +="                </div>"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        htmlStr +="                    <div class=\"datagrid-title\">价格</div>"
                        htmlStr +="                    <div class=\"datagrid-content\">"+obj.price+"元</div>"
                        htmlStr +="                 </div>"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        htmlStr +="                    <div class=\"datagrid-title\">提供服务</div>"
                        htmlStr +="                    <div class=\"datagrid-content\">"
                        htmlStr +="          <span class=\"status status-green\">"
                        htmlStr +="            上门取货"
                        htmlStr +="          </span>"
                        htmlStr +="                    </div>"
                        htmlStr +="                </div>"
                        htmlStr +="                <div class=\"datagrid-item\">"
                        //htmlStr +="                    <button class=\"btn btn-primary\">一键拼单</button>"
                        htmlStr += "<button onclick='showDetail("+index+")' class=\"btn btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#modal-report\" _msttexthash=\"14020526\" _msthash=\"143\">一键拼单</button>"
                        htmlStr +="                </div>"
                        htmlStr +="            </div>"
                        htmlStr +="        </div>"
                        htmlStr +="    </div>"
                        htmlStr +="</div>"

                        htmlStr += "<div id=\"listId_"+index+"\" hidden class=\"datagrid-content\">"+obj.id+"</div>"
                        htmlStr += "<div id=\"company_"+index+"\" hidden class=\"datagrid-content\">"+obj.company+"</div>"
                        htmlStr += "<div id=\"number_"+index+"\" hidden class=\"datagrid-content\">"+obj.number+"</div>"
                        htmlStr += "<div id=\"email_"+index+"\" hidden class=\"datagrid-content\">"+obj.email+"</div>"
                        htmlStr += "<div id=\"username_"+index+"\" hidden class=\"datagrid-content\">"+obj.username+"</div>"
                        htmlStr += "<div id=\"pickupTime_"+index+"\" hidden class=\"datagrid-content\">"+obj.pickupTime+"</div>"
                        htmlStr += "<div id=\"deliveryTime_"+index+"\" hidden class=\"datagrid-content\">"+obj.deliveryTime+"</div>"
                        htmlStr += "<div id=\"transportMode_"+index+"\" hidden class=\"datagrid-content\">"+obj.transportMode+"</div>"
                        htmlStr += "<div id=\"logisticsType_"+index+"\" hidden class=\"datagrid-content\">"+obj.logisticsType+"</div>"
                        htmlStr += "<div id=\"volume_"+index+"\" hidden class=\"datagrid-content\">"+obj.volume+"</div>"
                        htmlStr += "<div id=\"weight_"+index+"\" hidden class=\"datagrid-content\">"+obj.weight+"</div>"
                        htmlStr += "<div id=\"pickupDetailAddress_"+index+"\" hidden class=\"datagrid-content\">"+obj.beginAddress+"</div>"
                        htmlStr += "<div id=\"unloadDetailAddress_"+index+"\" hidden class=\"datagrid-content\">"+obj.endAddress+"</div>"
                        htmlStr += "<div id=\"price_"+index+"\" hidden class=\"datagrid-content\">"+obj.price+"</div>"
                        htmlStr += "<div id=\"remark_"+index+"\" hidden class=\"datagrid-content\">"+obj.remark+"</div>"




                    })
                    $("#tbody").html(htmlStr)
                    $("#tipMsg").html("")


                }
            })
        }

        $(function (){

            window.onload = initialData();

            let info = {};
            /**
             * 省市下拉框变化  更新对应数据
             */
            $('#select_user_address_province_pickup').change(function(){
                updateCityInfo("select_user_address_province_pickup","select_user_address_city_pickup","select_user_address_district_pickup")
            });
            $("#select_user_address_city_pickup").change(function () {
                updateDistrictInfo("select_user_address_city_pickup","select_user_address_district_pickup")
            });
            $('#select_user_address_province_unload').change(function(){
                updateCityInfo("select_user_address_province_unload","select_user_address_city_unload","select_user_address_district_unload")
            });
            $("#select_user_address_city_unload").change(function () {
                updateDistrictInfo("select_user_address_city_unload","select_user_address_district_unload")
            });

            $('#select_user_address_province_pickup_torder').change(function(){
                updateCityInfo("select_user_address_province_pickup_torder","select_user_address_city_pickup_torder","select_user_address_district_pickup_torder")
            });
            $("#select_user_address_city_pickup_torder").change(function () {
                updateDistrictInfo("select_user_address_city_pickup_torder","select_user_address_district_pickup_torder")
            });
            $('#select_user_address_province_unload_torder').change(function(){
                updateCityInfo("select_user_address_province_unload_torder","select_user_address_city_unload_torder","select_user_address_district_unload_torder")
            });
            $("#select_user_address_city_unload_torder").change(function () {
                updateDistrictInfo("select_user_address_city_unload_torder","select_user_address_district_unload_torder")
            });


            $("#queryTransportOrderBtn").click(function (){

                var logisticsType = $("#logisticsType").val();
                var transportMode = $("#transportMode").val();
                var volume = $("#volume").val();
                var weight = $("#weight").val();
                var maxPrice = $("#maxPrice").val();
                var minPrice = $("#minPrice").val();
                var pickUpCity = $("#select_user_address_city_pickup").val();
                var unloadCity = $("#select_user_address_city_unload").val();
                var pickupTime = $("#pickupTime").val().replace('T',' ');

                if (pickupTime == null || pickupTime === "" ||
                    maxPrice == null || maxPrice === "" ||
                    minPrice == null || minPrice === ""){
                    $("#tipMsg").html("请输入必填信息")
                    return
                }else if(maxPrice < minPrice){
                    $("#tipMsg").html("最高价不得低于最低价")
                    return;
                }
                var params = {logisticsType,transportMode,volume,weight,maxPrice,minPrice,pickUpCity,unloadCity,pickupTime}

                queryAjax(params);
            })




            /**
             * 支付按钮
             */
            $("#payBtn").click(function (){
                var tId = $("#edit-id").text();
                var cargoInfo = $("#cargoInfo").val();
                var pickupAddress = $("#select_user_address_district_pickup_torder").val();
                var pickupDetailAddress = $("#pickupDetailAddress").val();
                var unloadAddress = $("#select_user_address_district_unload_torder").val();
                var unloadDetailAddress = $("#unloadDetailAddress").val();

                var params = {tId, cargoInfo, pickupAddress, pickupDetailAddress ,unloadAddress ,unloadDetailAddress}
                console.log("params",params)
                if(pickupDetailAddress == null || pickupDetailAddress == "" ||
                    unloadDetailAddress == null || unloadDetailAddress == "" ||
                    cargoInfo == null || cargoInfo == "" ){
                    $("#tipMsg2").html("请输入必填信息")
                    $("#modal-report").modal("show")
                    return
                }
                $.ajax({
                    url:'dev/torder/payTOrder',
                    data: params,
                    type:'post',
                    dataType:'json',
                    success: data => {
                        if(data.data == null){
                            alert("支付成功")

                            //刷新数据

                            if (($("#minPrice").val() == null) || ($("#minPrice").val() == "")){

                                window.location.href = 'toListQueryConsign'

                            }else{

                                $("#queryTransportOrderBtn").click();
                            }
                            /**
                             * todo 模态款关闭有问题
                             */

                        }else{
                            alert(data.data)
                        }
                    }
                })


            })
        })




        function showDetail(index){
            //重置数据
            $("#edit-id").val("");
            $("#cargoInfo").val("");
            $("#pickupDetailAddress").val("");
            $("#unloadDetailAddress").val("");

            //把id放入隐藏域
            $("#tipMsg2").html("")
            $("#edit-id").text($("#listId_"+index).text())

            $("#company").text($("#company_"+index).text())
            $("#number").text($("#number_"+index).text())
            $("#email").text($("#email_"+index).text())
            $("#username").text($("#username_"+index).text())

            $("#pickupTime_detail").val($("#pickupTime_"+index).text())
            $("#deliveryTime_detail").val($("#deliveryTime_"+index).text())
            $("#transportMode_detail").val($("#transportMode_"+index).text())
            $("#logisticsType_detail").val($("#logisticsType_"+index).text())
            $("#volume_detail").val($("#volume_"+index).text())
            $("#weight_detail").val($("#weight_"+index).text())
            $("#pickupDetailAddress_detail").val($("#pickupDetailAddress_"+index).text())
            $("#unloadDetailAddress_detail").val($("#unloadDetailAddress_"+index).text())
            $("#price_detail").val($("#price_"+index).text())
            $("#remark_detail").val($("#remark_"+index).text())



        }


        /**
         * 根据三个select标签id 将地址信息更新
         * @param ProvinceId
         * @param CityId
         * @param DistrictId
         */
        function updateCityInfo(ProvinceId,CityId,DistrictId){
            $.ajax({
                type: "GET",
                url: "dev/address/getAddress/" + $("#" + ProvinceId).val(),
                data: null,
                dataType: "json",
                success: function (data) {
                    $(".loader").hide();
                    if (data.success) {
                        $("#" + CityId).empty();
                        $("#" + DistrictId).empty();
                        for (var i = 0; i < data.addressList.length; i++) {
                            var address_id = data.addressList[i].addressAreaid;
                            var address_name = data.addressList[i].addressName;
                            $("#" + CityId).append("<option value='" + address_id + "'>" + address_name + "</option>")
                        }
                        for (var j = 0; j < data.childAddressList.length; j++) {
                            var childAddress_id = data.childAddressList[j].addressAreaid;
                            var childAddress_name = data.childAddressList[j].addressName;
                            $("#" + DistrictId).append("<option value='" + childAddress_id + "'>" + childAddress_name + "</option>")
                        }

                        //alert($("#select_user_address_province").find("option:selected").text())

                    } else {
                        alert("加载地区信息失败，请刷新页面再试！")
                    }
                },
                beforeSend: function () {
                    $(".loader").show();
                },
                error: function () {
                    alert("加载地区信息失败，请刷新页面再试！")
                }
            });
        }
        function updateDistrictInfo(CityId,DistrictId){
            $.ajax({
                type: "GET",
                url: "dev/address/getAddress/" + $("#" + CityId).val(),
                data: null,
                dataType: "json",
                success: function (data) {
                    $(".loader").hide();
                    if (data.success) {
                        $("#" + DistrictId).empty();
                        for (var i = 0; i < data.addressList.length; i++) {
                            var address_id = data.addressList[i].addressAreaid;
                            var address_name = data.addressList[i].addressName;
                            $("#" + DistrictId).append("<option value='" + address_id + "'>" + address_name + "</option>")
                        }
                        //alert($("#select_user_address_city").find("option:selected").text())
                    } else {
                        alert("加载地区信息失败，请刷新页面再试！")
                    }
                },
                beforeSend: function () {
                    $(".loader").show();
                },
                error: function () {
                    alert("加载地区信息失败，请刷新页面再试！")
                }
            });
        }
    </script>

</head>
<body>
<script type="text/javascript" src="${pageContext.request.contextPath}/res/js/demo-theme.js"></script>
<div class="page">
    <!-- Navbar -->
    <header class="navbar navbar-expand-md navbar-light d-print-none">
        <div class="container-xl">
            <!--LOGO-->
            <h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3">
                <a href="toListQueryConsign">
                    <img src="${pageContext.request.contextPath}/res/images/index-logo-c.png" width="110" height="32" alt="Tabler" class="navbar-brand-image">
                </a>
            </h1>
            <div class="navbar-nav flex-row order-md-last">
                <div class="d-none d-md-flex">
                    <!--月亮-->
                    <a href="?theme=dark" class="nav-link px-0 hide-theme-dark" title="Enable dark mode"
                       data-bs-toggle="tooltip"
                       data-bs-placement="bottom">
                        <!-- Download SVG icon from http://tabler-icons.io/i/moon -->
                        <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24"
                             stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
                             stroke-linejoin="round">
                            <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
                            <path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454z"/>
                        </svg>
                    </a>
                    <a href="?theme=light" class="nav-link px-0 hide-theme-light" title="Enable light mode" data-bs-toggle="tooltip"
                       data-bs-placement="bottom">
                        <!-- Download SVG icon from http://tabler-icons.io/i/sun -->
                        <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 12m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0" /><path d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7" /></svg>
                    </a>
                    <!--消息-->
                    <div class="nav-item dropdown d-none d-md-flex me-3">
                        <a href="#" class="nav-link px-0" data-bs-toggle="dropdown" tabindex="-1"
                           aria-label="Show notifications">
                            <!-- Download SVG icon from http://tabler-icons.io/i/bell -->
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24"
                                 viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
                                 stroke-linecap="round" stroke-linejoin="round">
                                <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
                                <path d="M10 5a2 2 0 0 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3h-16a4 4 0 0 0 2 -3v-3a7 7 0 0 1 4 -6"/>
                                <path d="M9 17v1a3 3 0 0 0 6 0v-1"/>
                            </svg>
                            <span class="badge bg-red"></span>
                        </a>
                    </div>
                </div>
                <!--头像-->
                <div class="nav-item dropdown">
                    <a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown"
                       aria-label="Open user menu">
                        <span class="avatar avatar-sm" style="background-image: url(${pageContext.request.contextPath}/res/images/000m.jpg)"></span>
                        <div class="d-none d-xl-block ps-2">
                            <div id="username_user"></div>
                            <div id="number_user" class="mt-1 small text-muted">ID:15966565881</div>
                        </div>
                    </a>
                    <div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
                        <a href="toUserInfo" class="dropdown-item">个人资料</a>
                        <a href="logOut" class="dropdown-item">退出登录</a>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <header class="navbar-expand-md">
        <div class="collapse navbar-collapse" id="navbar-menu">
            <div class="navbar navbar-light">
                <div class="container-xl">
                    <ul class="navbar-nav">
                        <li class="nav-item">
                            <a class="nav-link" href="getAddressInfo">
                    <span class="nav-link-icon d-md-none d-lg-inline-block">
                        <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-clipboard-text"
                             width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"
                             fill="none" stroke-linecap="round" stroke-linejoin="round">
                           <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                           <path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2"></path>
                           <path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z"></path>
                           <path d="M9 12h6"></path>
                           <path d="M9 16h6"></path>
                        </svg>
                    </span>
                                <span class="nav-link-title">
                      拼单发布
                    </span>
                            </a>
                        </li>
                        <li class="nav-item active">
                            <a class="nav-link" href="toListQueryConsign">
                    <span class="nav-link-icon d-md-none d-lg-inline-block">
                      <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-list-search"
                           width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
                           stroke-linecap="round" stroke-linejoin="round">
                           <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                           <path d="M15 15m-4 0a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path>
                           <path d="M18.5 18.5l2.5 2.5"></path>
                           <path d="M4 6h16"></path>
                           <path d="M4 12h4"></path>
                           <path d="M4 18h4"></path>
                      </svg>
                    </span>
                                <span class="nav-link-title">
                      智能查询
                    </span>

                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="toMyReleaseConsign">
                    <span class="nav-link-icon d-md-none d-lg-inline-block">
                      <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-ad-2" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                       <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                       <path d="M11.933 5h-6.933v16h13v-8"></path>
                       <path d="M14 17h-5"></path>
                       <path d="M9 13h5v-4h-5z"></path>
                       <path d="M15 5v-2"></path>
                       <path d="M18 6l2 -2"></path>
                       <path d="M19 9h2"></path>
                      </svg>
                    </span>
                                <span class="nav-link-title">
                      我的发布
                    </span>
                            </a>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link" href="toOrderManagementConsign">
                    <span class="nav-link-icon d-md-none d-lg-inline-block">
                     <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-books" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                       <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                       <path d="M5 4m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v14a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z"></path>
                       <path d="M9 4m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v14a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z"></path>
                       <path d="M5 8h4"></path>
                       <path d="M9 16h4"></path>
                       <path d="M13.803 4.56l2.184 -.53c.562 -.135 1.133 .19 1.282 .732l3.695 13.418a1.02 1.02 0 0 1 -.634 1.219l-.133 .041l-2.184 .53c-.562 .135 -1.133 -.19 -1.282 -.732l-3.695 -13.418a1.02 1.02 0 0 1 .634 -1.219l.133 -.041z"></path>
                       <path d="M14 9l4 -1"></path>
                       <path d="M16 16l3.923 -.98"></path>
                     </svg>
                    </span>
                                <span class="nav-link-title">
                      我发的单
                    </span>
                            </a>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link" href="toOrderManagementConsignElse">
                    <span class="nav-link-icon d-md-none d-lg-inline-block">
                     <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-books" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                       <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                       <path d="M5 4m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v14a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z"></path>
                       <path d="M9 4m0 1a1 1 0 0 1 1 -1h2a1 1 0 0 1 1 1v14a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1z"></path>
                       <path d="M5 8h4"></path>
                       <path d="M9 16h4"></path>
                       <path d="M13.803 4.56l2.184 -.53c.562 -.135 1.133 .19 1.282 .732l3.695 13.418a1.02 1.02 0 0 1 -.634 1.219l-.133 .041l-2.184 .53c-.562 .135 -1.133 -.19 -1.282 -.732l-3.695 -13.418a1.02 1.02 0 0 1 .634 -1.219l.133 -.041z"></path>
                       <path d="M14 9l4 -1"></path>
                       <path d="M16 16l3.923 -.98"></path>
                     </svg>
                    </span>
                                <span class="nav-link-title">
                      我拼的单
                    </span>
                            </a>
                        </li>

                    </ul>
                </div>
            </div>
        </div>
    </header>
    <div class="page-body">
        <div class="container-xl">
            <div class="row row-cards">
                <div class="col-lg-12">
                    <div class="row row-cards">
                        <div class="col-12">
                            <form class="card">
                                <div class="card-body">
                                    <div class="row row-cards">
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label class="form-label required">取货时间
                                                </label>
                                                <input id="pickupTime" type="datetime-local" class="form-control">
                                            </div>
                                        </div>
<%--                                        <div class="col-sm-6 col-md-3">--%>
<%--                                            <div class="mb-3">--%>
<%--                                                <label class="form-label">运输时效</label>--%>
<%--                                                <input id="limitTime" type="number" class="form-control" placeholder="单位：小时">--%>
<%--                                            </div>--%>
<%--                                        </div>--%>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label required">价格区间（最低价）
                                                    <span id="minPriceMsg" style="color: red; font-size: 18px"></span>
                                                </label>
                                                <input id="minPrice" type="number" class="form-control" placeholder="单位：元">
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label required">价格区间（最高价）
                                                    <span id="maxPriceMsg" style="color: red; font-size: 20px"></span>
                                                </label>
                                                <input id="maxPrice" type="number" class="form-control" placeholder="单位：元">
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">运输方式</label>
                                                <select id="transportMode" class="form-control form-select">
                                                    <option value="陆运（货车_高速）">陆运（货车_高速）</option>
                                                    <option value="空运（专机）">空运（专机）</option>
                                                    <option value="航运">航运</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">物流类型</label>
                                                <select id="logisticsType" class="form-control form-select">
                                                    <option value="普通快递">普通快递</option>
                                                    <option value="大件物流">大件物流</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">占用体积</label>
                                                <input id="volume" type="number" class="form-control" placeholder="单位：M³">
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">占用重量</label>
                                                <input id="weight" type="number" class="form-control" placeholder="单位：KG">
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-2">
                                                <label class="form-label">取货地址</label>
                                                <select class="form-control form-select" id="select_user_address_province_pickup">
                                                    <c:forEach items="${requestScope.addressList}" var="address" varStatus="i">
                                                        <option value="${address.addressAreaid}"
                                                                <c:if test="${requestScope.addressId==address.addressAreaid}">selected</c:if>>${address.addressName}</option>
                                                    </c:forEach>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-2">
                                                <label class="form-label"><br/></label>
                                                <select class="form-control form-select" id="select_user_address_city_pickup" data-size="8" data-live-search="true">
                                                    <c:forEach items="${requestScope.cityList}" var="address" varStatus="i">
                                                        <option value="${address.addressAreaid}"
                                                                <c:if test="${requestScope.cityAddressId==address.addressRegionid}">selected</c:if>>${address.addressName}</option>
                                                    </c:forEach>
                                                </select>
                                            </div>
                                        </div>
<%--                                        <div class="col-sm-6 col-md-2">--%>
<%--                                            <div class="mb-2">--%>
<%--                                                <label class="form-label"><br/></label>--%>
<%--                                                <select name="user_address" class="form-control form-select" id="select_user_address_district_pickup" data-size="8"--%>
<%--                                                        data-live-search="true">--%>
<%--                                                    <c:forEach items="${requestScope.districtList}" var="address" varStatus="i">--%>
<%--                                                        <option value="${address.addressAreaid}"--%>
<%--                                                                <c:if test="${requestScope.districtAddressId==address.addressAreaid} || ${requestScope.districtAddressId=='0'} ">selected</c:if>>${address.addressName}</option>--%>
<%--                                                    </c:forEach>--%>
<%--                                                </select>--%>
<%--                                            </div>--%>
<%--                                        </div>--%>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-2">
                                                <label class="form-label">卸货地址</label>
                                                <select class="form-control form-select" id="select_user_address_province_unload">
                                                    <c:forEach items="${requestScope.addressList}" var="address" varStatus="i">
                                                        <option value="${address.addressAreaid}"
                                                                <c:if test="${requestScope.addressId==address.addressAreaid}">selected</c:if>>${address.addressName}</option>
                                                    </c:forEach>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-2">
                                                <label class="form-label"><br/></label>
                                                <select class="form-control form-select" id="select_user_address_city_unload" data-size="8" data-live-search="true">
                                                    <c:forEach items="${requestScope.cityList}" var="address" varStatus="i">
                                                        <option value="${address.addressAreaid}"
                                                                <c:if test="${requestScope.cityAddressId==address.addressRegionid}">selected</c:if>>${address.addressName}</option>
                                                    </c:forEach>
                                                </select>
                                            </div>
                                        </div>
<%--                                        <div class="col-sm-6 col-md-2">--%>
<%--                                            <div class="mb-2">--%>
<%--                                                <label class="form-label"><br/></label>--%>
<%--                                                <select name="user_address" class="form-control form-select" id="select_user_address_district_unload" data-size="8"--%>
<%--                                                        data-live-search="true">--%>
<%--                                                    <tbody id="addLimit"></tbody>--%>
<%--                                                    <c:forEach items="${requestScope.districtList}" var="address" varStatus="i">--%>
<%--                                                        <option value="${address.addressAreaid}"--%>
<%--                                                                <c:if test="${requestScope.districtAddressId==address.addressAreaid}">selected</c:if>>${address.addressName}</option>--%>
<%--                                                    </c:forEach>--%>

<%--                                                </select>--%>
<%--                                            </div>--%>
<%--                                        </div>--%>
                                    </div>
                                </div>

                                <div class="card-footer text-center">

                                    <button type="submit" class="btn btn-primary" style="background-color: lightslategrey">重置</button>
                                    <button id="queryTransportOrderBtn" type="button" class="btn btn-primary">查询</button>
                                    <span id="tipMsg" style="color: red; font-size: 20px"></span>
                                </div>

                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="page-header d-print-none">
        <div class="container-xl">
            <div class="row g-2 align-items-center">
                <div class="col">
                    <h2 class="page-title" style="color: dodgerblue">
                        智能推荐
                    </h2>
                </div>
            </div>
        </div>
    </div>
    <div class="page-body">
        <div class="container-xl">
            <div class="card" style="border-color: transparent;background-color: transparent">
                <div id="tbody" class="row row-cards">

                    <%--<div class="col-6">
                        <div class="card">
                            <div class="card-header">
                                <h2 class="card-title">承运方：顺东物流有限公司</h2>
                            </div>
                            <div class="card-body">
                                <div class="datagrid">
                                    <div class="datagrid-item">
                                        <div class="datagrid-title">装载时间</div>
                                        <div class="datagrid-content">2023年3月10日14:00-15:00</div>
                                    </div>
                                    <div class="datagrid-item">
                                        <div class="datagrid-title">运输时效</div>
                                        <div class="datagrid-content">48小时</div>
                                    </div>
                                    <div class="datagrid-item">
                                        <div class="datagrid-title">运输方式</div>
                                        <div class="datagrid-content">货车运输</div>
                                    </div>
                                    <div class="datagrid-item">
                                        <div class="datagrid-title">装载空间</div>
                                        <div class="datagrid-content">25立方米，五吨</div>
                                    </div>


                                    <div class="datagrid-item">
                                        <div class="datagrid-title">出发地</div>
                                        <div class="datagrid-content">广东省广州市从化区集散中心</div>
                                    </div>
                                    <div class="datagrid-item">
                                        <div class="datagrid-title">目的地</div>
                                        <div class="datagrid-content">浙江省杭州市西湖区集散中心</div>
                                    </div>
                                    <div class="datagrid-item">
                                        <div class="datagrid-title">价格</div>
                                        <div class="datagrid-content">12元</div>
                                    </div>
                                    <div class="datagrid-item">
                                        <div class="datagrid-title">提供服务</div>
                                        <div class="datagrid-content">
                                  <span class="status status-green">
                                    上门取货
                                  </span>
                                        </div>
                                    </div>
                                    <div class="datagrid-item">
                                        <button class="btn btn-primary">一键拼单</button>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>--%>

                </div>
                <br/>
               <%-- <div class="card-footer d-flex align-items-center">
                    <p class="m-0 text-muted">显示 <span>1</span> - <span>6</span> 共 <span>16条</span> 记录</p>
                    <ul class="pagination m-0 ms-auto">
                        <li class="page-item disabled">
                            <a class="page-link" href="#" tabindex="-1" aria-disabled="true">
                                <!-- Download SVG icon from http://tabler-icons.io/i/chevron-left -->
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 6l-6 6l6 6" /></svg>
                                prev
                            </a>
                        </li>
                        <li class="page-item active"><a class="page-link" href="#">1</a></li>
                        <li class="page-item"><a class="page-link" href="#">2</a></li>
                        <li class="page-item"><a class="page-link" href="#">3</a></li>
                        <li class="page-item"><a class="page-link" href="#">4</a></li>
                        <li class="page-item"><a class="page-link" href="#">5</a></li>
                        <li class="page-item">
                            <a class="page-link" href="#">
                                next <!-- Download SVG icon from http://tabler-icons.io/i/chevron-right -->
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 6l6 6l-6 6" /></svg>
                            </a>
                        </li>
                    </ul>
                </div>--%>
                <div class="card-footer d-flex align-items-center">
                    <p class="m-0 text-muted">显示 <span>1</span> - <span></span> 共 <span>条</span> 记录</p>
                    <ul class="pagination m-0 ms-auto">
                        <li class="page-item disabled">
                            <a class="page-link" href="#" tabindex="-1" aria-disabled="true">
                                <!-- Download SVG icon from http://tabler-icons.io/i/chevron-left -->
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M15 6l-6 6l6 6" /></svg>
                                prev
                            </a>
                        </li>
                        <li class="page-item active"><a class="page-link" href="#">1</a></li>
                        <li class="page-item"><a class="page-link" href="#">2</a></li>
                        <li class="page-item"><a class="page-link" href="#">3</a></li>
                        <li class="page-item"><a class="page-link" href="#">4</a></li>
                        <li class="page-item"><a class="page-link" href="#">5</a></li>
                        <li class="page-item">
                            <a class="page-link" href="#">
                                next <!-- Download SVG icon from http://tabler-icons.io/i/chevron-right -->
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 6l6 6l-6 6" /></svg>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>

        </div>
    </div>
</div>





<div class="modal modal-blur fade" id="modal-report" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">一键拼单</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <input type="hidden" id="edit-id">
            <div class="modal-body">
                <div class="card" style="border-color: transparent;background-color: transparent">
                    <div class="row row-cards">
                        <div class="col-12">
                            <div class="card">
                                <div class="card-header">
                                    <h2 class="card-title" style="font-weight: bold;color: red">温馨提示：支付前请与承运方联系沟通，确定上下货地址和方式，避免拼单失败！</h2>
                                </div>
                                <div class="card-body">
                                    <div class="datagrid">
                                        <div class="datagrid">
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">承运方</div>
                                                <div id="company" class="datagrid-content"></div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">联系人</div>
                                                <div id="username" class="datagrid-content"></div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">联系方式</div>
                                                <div id="number" class="datagrid-content"></div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">邮箱</div>
                                                <div id="email" class="datagrid-content"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <br/>
                <div class="card" style="border-color: transparent;background-color: transparent">
                    <div class="row row-cards">
                        <div class="col-12">
                            <div class="card">
                                <div class="card-header">
                                    <h2 class="card-title" style="font-weight: bold;color: dodgerblue">承运拼单详情</h2>
                                </div>
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label class="form-label">装载时间
                                                </label>
                                                <input id="pickupTime_detail" type="text" readonly class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label class="form-label">预计送达时间

                                                </label>
                                                <input id="deliveryTime_detail" type="text" readonly class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">运输方式</label>
                                                <input id="transportMode_detail" type="text" readonly class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">物流类型</label>
                                                <input id="logisticsType_detail" type="text" readonly class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">可用空间(m³)</label>
                                                <input id="volume_detail" type="text" readonly  class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-sm-6 col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">可载重量(KG)</label>
                                                <input id="weight_detail" type="text" readonly class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label class="form-label">装载地址</label>
                                                <input id="pickupDetailAddress_detail" type="text" readonly class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label class="form-label" >卸货地址</label>
                                                <input id="unloadDetailAddress_detail" type="text" readonly class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="mb-3">
                                                <label class="form-label">价格(￥)</label>
                                                <input id="price_detail" type="text" readonly class="form-control">
                                            </div>
                                        </div>
                                        <div class="col-md-9">
                                            <div class="mb-3">
                                                <label class="form-label">备注</label>
                                                <input id="remark_detail" type="text" readonly class="form-control" style="color: red">
                                            </div>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="hr-text">
                    <h2 style="color: dodgerblue">物流信息填写</h2>
                </div>
                <div class="row">
                    <div class="col-sm-6 col-md-2">
                        <div class="mb-2">
                            <label class="form-label required">取货地址</label>
                            <select class="form-control form-select" id="select_user_address_province_pickup_torder">
                                <c:forEach items="${requestScope.addressList}" var="address" varStatus="i">
                                    <option value="${address.addressAreaid}"
                                            <c:if test="${requestScope.addressId==address.addressAreaid}">selected</c:if>>${address.addressName}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>

                    <div class="col-sm-6 col-md-2">
                        <div class="mb-2">
                            <label class="form-label"><br/></label>
                            <select class="form-control form-select" id="select_user_address_city_pickup_torder" data-size="8" data-live-search="true">
                                <c:forEach items="${requestScope.cityList}" var="address" varStatus="i">
                                    <option value="${address.addressAreaid}"
                                            <c:if test="${requestScope.cityAddressId==address.addressRegionid}">selected</c:if>>${address.addressName}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>
                    <div class="col-sm-6 col-md-2">
                        <div class="mb-2">
                            <label class="form-label"><br/></label>
                            <select name="user_address" class="form-control form-select" id="select_user_address_district_pickup_torder" data-size="8"
                                    data-live-search="true">
                                <c:forEach items="${requestScope.districtList}" var="address" varStatus="i">
                                    <option value="${address.addressAreaid}"
                                            <c:if test="${requestScope.districtAddressId==address.addressAreaid}">selected</c:if>>${address.addressName}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label required">取货详细地址</label>
                            <input id="pickupDetailAddress" type="text" class="form-control">
                        </div>
                    </div>
                    <div class="col-sm-6 col-md-2">
                        <div class="mb-2">
                            <label class="form-label required">卸货地址</label>
                            <select class="form-control form-select" id="select_user_address_province_unload_torder">
                                <c:forEach items="${requestScope.addressList}" var="address" varStatus="i">
                                    <option value="${address.addressAreaid}"
                                            <c:if test="${requestScope.addressId==address.addressAreaid}">selected</c:if>>${address.addressName}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>
                    <div class="col-sm-6 col-md-2">
                        <div class="mb-2">
                            <label class="form-label"><br/></label>
                            <select class="form-control form-select" id="select_user_address_city_unload_torder" data-size="8" data-live-search="true">
                                <c:forEach items="${requestScope.cityList}" var="address" varStatus="i">
                                    <option value="${address.addressAreaid}"
                                            <c:if test="${requestScope.cityAddressId==address.addressRegionid}">selected</c:if>>${address.addressName}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>
                    <div class="col-sm-6 col-md-2">
                        <div class="mb-2">
                            <label class="form-label"><br/></label>
                            <select name="user_address" class="form-control form-select" id="select_user_address_district_unload_torder" data-size="8"
                                    data-live-search="true">
                                <c:forEach items="${requestScope.districtList}" var="address" varStatus="i">
                                    <option value="${address.addressAreaid}"
                                            <c:if test="${requestScope.districtAddressId==address.addressAreaid}">selected</c:if>>${address.addressName}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="mb-3">
                            <label class="form-label required">卸货详细地址</label>
                            <input id="unloadDetailAddress" type="text" class="form-control">
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="mb-3">
                            <label class="form-label required">货物信息</label>
                            <input id="cargoInfo" type="text" class="form-control">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <a href="#" class="btn btn-link link-secondary" data-bs-dismiss="modal">
                        取消
                    </a>
                    <span id="tipMsg2" style="color: red; font-size: 20px"></span>
                    <button id="payBtn" class="btn btn-primary ms-auto" data-bs-dismiss="modal">
                        确定支付
                    </button>
                </div>
            </div>
        </div>
    </div>

    <%--弹出模态框的js,删了模态框不能用哈--%>
    <!-- Libs JS -->
    <!-- Tabler Core -->
    <script src="${pageContext.request.contextPath}/res/js/tabler.js" defer></script>
    <script src="${pageContext.request.contextPath}/res/js/demo.js" defer></script>













</body>
</html>
